<!DOCTYPE html>
<html>
<head>
        <meta charset="UTF-8">
        <title>钢蛋音乐</title>

        <style>
            body{
                background-image: linear-gradient(red, white);
                margin:0;
                /*background-image: url("../img/5.jpg");*/
                background-size:100% 100%;
                background-attachment:fixed;
            }
       #one{
            /*去除选项前的实心圆标记*/
            list-style-type: none;
            height: 88px;
            margin: 0;
            padding: 0;
            /*内容被修剪但不会显示查看修剪内容的滚动条*/
            overflow: hidden;
            background-color: #333;
        }

         li {
            float: left;
        }

        .a{
            margin-left: 20px;
            display: block;
            color: white;
            text-align: center;
            padding: 30px 16px;
            /*无文本修饰，去除a标签的下划线修饰*/
            text-decoration: none;
        }
            .o{
                font-weight: lighter;
                margin-left: 20px;
                display: block;
                color: black;
                text-align: center;
                padding: 12px 16px;
                /*无文本修饰，去除a标签的下划线修饰*/
                text-decoration: none;
        }
         li img {
            display: block;
            padding: 20px 16px;
        }

        .a:hover {
            background-color: #111;
        }
      li h1{
            margin-left: 0;
            color: white;
        }
      li h2{
          margin-top: 5px;
          font-style: oblique;
      }


        #search input {

            width: 270px;

            height: 35px;

            border: 0;                          //去掉input边框

        font-size: 14px;

            outline: none;

            background-color: rgba(32, 74, 102, 0);

            color: white;

            font-size: 16px;

            margin: 0 10px;
        }


        #search{

            width: 320px;

            height: 35px;

            border: 1px solid white;

            border-radius: 30px;                    //把边框设计成半圆

             display:flex;

            margin-top:25px;
            margin-left: 90px;
        }
       #two {
           /*去除选项前的实心圆标记*/
           list-style-type: none;
           height: 48px;
           margin: 0;
           padding: 0;
           /*内容被修剪但不会显示查看修剪内容的滚动条*/
           overflow: hidden;
           background-color: #c20c0c;

       }
       .l{
           margin-left: 180px;
       }
       .b{

           margin-left: 60px;
           display: block;
           color: white;
           text-align: center;
           padding: 15px 6px;
           /*无文本修饰，去除a标签的下划线修饰*/
           text-decoration: none;
       }
       .b:hover {
           background-color :#9B0909 ;
           border-radius: 20px;
       }

    .img{
        width: 1200px;
        height: 600px;
        object-fit: cover;
    }


     span :hover{
        background-color: white;
    }
     #three{
         position: absolute;
         margin-top: -20px;
         padding: 0;
         margin-left: 160px;
         background-color: white;
         height: 1800px;
         width: 900px;
     }
     #four{
         margin-top: -20px;
         position: absolute;
         background-color: white;
         margin-left: 1060px;
         height: 1800px;
         width: 300px;
     }
     .five{
         list-style-type: none;
         height: 42px;
         margin-top: 50px;
         padding: 0;
         /*内容被修剪但不会显示查看修剪内容的滚动条*/
         overflow: hidden;
         background-color: white;
         border-bottom: red solid 3px;
     }
     .img1{
         margin-top: -15px;

     }
     .o:hover{
         padding: 1px;
         border-bottom: 1px solid black;
     }
            .p:hover{
         padding: 1px;
         border-bottom: 1px solid black;
     }  .p1:hover{
         padding: 1px;
         border-bottom: 1px solid black;
     }
     .p{
         font-weight: lighter;
         margin-left: 99px;
         display: block;
         color: black;
         text-align: center;
         padding: 12px 16px;
         /*无文本修饰，去除a标签的下划线修饰*/
         text-decoration: none;
     }
            .p1{
         font-weight: lighter;
         margin-left: 520px;
         display: block;
         color: black;
         text-align: center;
         padding: 12px 16px;
         /*无文本修饰，去除a标签的下划线修饰*/
         text-decoration: none;
     }
            .p2{
                font-size: 13px;
                font-weight: 100;
                /*font-family:"Times New Roman",Georgia,Serif;*/
                margin: 0;
                display: block;
                color:black;
                text-align: center;
                padding: 12px 12px;
                /*无文本修饰，去除a标签的下划线修饰*/
                text-decoration: none;
            }
            .p2:hover{
                padding: 0;
                border-bottom: 1px solid black;
            }
     .img2{
         width: 150px;
         height: 150px;
         object-fit: cover;
     } .img3{
         width: 100px;
         height:100px;
         object-fit: cover;
     }.img4{
         width: 120px;
         height:120px;
         object-fit: cover;
     }
     .td1{
         margin-top: 30px;
         float: left;
         margin-left: 50px;
     }.td2{
         margin-top: 45px;
         float: left;
         margin-left: 45px;
     }

     .yl{
         color: #111111;
         font-weight: lighter;
         text-decoration: none;
     }
     .yl:hover{
         border-bottom: 1px solid black;
     }  .yl1{
                 padding-top: 20px;
         color: #111111;
         font-weight: bold;
         text-decoration: none;
     }
     .yl1:hover{
         border-bottom: 1px solid black;
     }
     .bg1{
         border-style: ridge;
         margin-top: 30px;
         margin-left: auto ;
         margin-right: auto;
         background-color: #BBBBBB;
         width: 800px;
         height: 200px;
     }
     .bg2{
         margin-top: 30px;
         margin-left: auto ;
         margin-right: auto;
         background-color: #BBBBBB;
         width: 800px;
         height: 605px;

     }
            .tab1 {
                border-collapse: collapse;
                width: 100%;
                border:1px solid black;
            }

            .th1 {
                text-align: center;
                padding: 8px;
                background-color: #f2f2f2;
                /*border:1px solid black;*/
            } .td4 {
                height: 45px;
                text-align:left;
                padding-left: 30px;
                              border:1px solid #999999;

            }

              .bg3{
                  width: 300px;
                  height: 150px;
                  background-color: #F4F4F4;
              }
              .bun3{
                  margin-top: 30px;
                  margin-left: 70px;
                  /*float: left;*/
                  width:100px;
                  height:30px;
                  background-color:#C20A0F;
                  border-radius:15px;
                  color: white;
              }.bun4{
                  margin-top: 30px;
                  /*margin-left: 70px;*/
                  /*float: left;*/
                  width:250px;
                  height:50px;
                  background-color:white;
                  border-radius:15px;
                  color: white;
              }
              .bun3:hover{
                  background-color: #DD151D;
              }
              .bun4:hover{
                  background-color: #999999;
              }

            .bg4{
                border: 1px solid #999999;
                /*设置边框*/
                border-right:none;
                border-bottom:none;
                width: 300px;
                height: 1510px;
                background-color: white;
            }.bg5{
                margin: auto;
                width: 250px;
                height: 1510px;
                background-color: white;
            }
            .dh{
                list-style-type: none;
                height: 40px;
                margin: 0;
                padding: 0;
                /*内容被修剪但不会显示查看修剪内容的滚动条*/
                overflow: hidden;
                background-color: white;
                border-bottom: black solid 1px;
            }
            .bg6{
                margin: 30px 0;
                width: 250px;
                height: 70px;
                background-color: #F4F4F4;
            }
            .bg6:hover{
                background-color: #999999;
            }
            .bg7{
                margin: 30px 0;
                width: 250px;
                height: 50px;
                background-color: white;
            }
            .bg7:hover{
                background-color: #F4F4F4;
            }
            #six{
                border: 1px solid #999999;
                /*设置边框*/
                border-left: none;
                border-right:none;
                border-bottom:none;
                margin-top: 1796px;
                /*float: bottom;*/
                width: 100%;
                height: 200px;
                background-color: #f2f2f2;
            }
            .bg8{
                position: absolute;
                margin-top:  30px ;
                margin-left: 160px;
                width: 590px;
                height: 160px;
                background-color: #f2f2f2;
            }
            .bg9{
                position: absolute;
                margin-top:  30px ;
                margin-left: 770px;
                width: 580px;
                height: 160px;
                background-color: #f2f2f2;
            }
            .six{
                list-style-type: none;
                height: 40px;
                margin-top: 0;
                padding: 0;
                /*内容被修剪但不会显示查看修剪内容的滚动条*/
                overflow: hidden;
                background-color: #f2f2f2;
            }
            .j{
                text-decoration: none;
                color: black;
            }
            .j:hover{
                border-bottom: black 1px solid;
            }
            .bim1{
                width: 100px;
                height: 100px;
                object-fit: cover;
                position: absolute;
                margin-top: -430px;
                margin-left: 40px;
            }
            .bim2{
                width: 100px;
                height: 100px;
                object-fit: cover;
                position: absolute;
                margin-left: 1370px;
                margin-top: -420px;
            }
    </style>
</head>
<body>
<ul id="one">
    <li><img src="../img/1.png"></li>
    <li><h1>钢蛋音乐</h1></li>
    <li><a class="a" href="javascript:void(0)" >发现音乐</a></li>
    <li><a href="javascript:void(0)" class="a">我的音乐</a></li>
    <li><a href="javascript:void(0)" class="a">关注</a></li>
    <li><a href="javascript:void(0)" class="a">商城</a></li>
    <li><a href="javascript:void(0)" class="a">音乐人</a></li>
    <li><a href="javascript:void(0)" class="a">下载客户端</a></li>
    <li>
        <div id="search">
            <input type="text" value="搜索：">
        </div>
    </li>
    <li><a href="javascript:void(0)" class="a">创作者中心</a></li>
    <li><a href="javascript:void(0)" class="a">登录</a></li>

</ul>


<ul id="two" >

    <li class="l"><a class="b" href="javascript:void(0)">推荐</a></li>
    <li ><a class="b" href="javascript:void(0)">排行榜</a></li>
    <li ><a class="b" href="javascript:void(0)">歌单</a></li>
    <li ><a class="b" href="javascript:void(0)">主播电台</a></li>
    <li ><a class="b" href="javascript:void(0)">歌手</a></li>
    <li ><a class="b" href="javascript:void(0)">新碟上架</a></li>

</ul>
<p style="text-align: center; margin-top: 0 ;" ><img src="../img/2.jpg" class="img" id="img"></p>
<a href="javascript:void(0)"><img  src="../img/40.png" class="bim1" onclick="fun1()" id="bun1"></a>
<a href="javascript:void(0)"><img  src="../img/41.png" class="bim2" onclick="fun2()" id="bun2"></a>
<div id="three">
    <ul class="five">
        <li><img src="../img/2.png" class="img1"></li>
        <li><h2 >热门推荐</h2></li>
        <li><a href="javascript:void(0)" class="o">华语</a></li>

        <li><a href="javascript:void(0)" class="o">流行</a></li>

        <li><a href="javascript:void(0)" class="o">民谣</a></li>

        <li><a href="javascript:void(0)" class="o">摇滚</a></li>

        <li><a href="javascript:void(0)" class="o">电子</a></li>
        <li><a href="javascript:void(0)" class="p">更多</a></li>

    </ul>
    <table>
        <tr>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/7.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br>戳爷/黄老板/断眉/萌<br>德/骚姆/比伯/烟卷</a></td>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/8.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br>看书刷题+纯音乐【学<br>习专用】</a></td>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/9.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br>华语民谣 I 孤独的心<br>诠释诗意和远方</a></td>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/10.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br> 月亮背面，是我宇宙<br>级的孤独</a></td>
        </tr>
        <tr>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/11.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br>Future Beats ◐ 糟糕<br>，是心肌梗塞的感觉<br>！</a></td>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/12.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br> 老祖宗她是真的狂-0<br>01-穿成了老祖宗（<br>求订阅！求关注！...</a></td>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/13.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br>【万评电音】抬头<br>，已是一片星海</a></td>
            <td class="td1"><a href="javascript:void(0)"><img src="../img/14.jpg" class="img2"></a><a href="javascript:void(0)" class="yl">
                <br> 爱能克服远距离</a></td>


        </tr>
    </table>


    <ul class="five">
        <li><img src="../img/2.png" class="img1"></li>
        <li><h2>新碟上架</h2></li>
        <li><a href="javascript:void(0)" class="p1">更多</a></li>

    </ul>
    <div class="bg1">
        <table>
            <tr>
                <td class="td2"><a href="javascript:void(0)"><img src="../img/15.jpg" class="img3"></a><a href="javascript:void(0)" class="yl">
                <br>冷暖迁徙 <br>kKzk赵珂</a></td>
                <td class="td2"><a href="javascript:void(0)"><img src="../img/16.jpg" class="img3"></a><a href="javascript:void(0)" class="yl">
                <br>MeAgainst The<br> World Melo</a></td>
                <td class="td2"><a href="javascript:void(0)"><img src="../img/17.jpg" class="img3"></a><a href="javascript:void(0)" class="yl">
                <br>无归属的她<br>祁紫檀</a></td>
                <td class="td2"><a href="javascript:void(0)"><img src="../img/18.jpg" class="img3"></a><a href="javascript:void(0)" class="yl">
                <br>启示录<br>G.E.M.邓紫棋</a></td>
                <td class="td2"><a href="javascript:void(0)"><img src="../img/19.jpg" class="img3"></a><a href="javascript:void(0)" class="yl">
                <br>Autofiction<br>Suede</a></td>
            </tr>
        </table>
    </div>
    <ul class="five">
        <li><img src="../img/2.png" class="img1"></li>
        <li><h2>榜单</h2></li>
        <li><a href="javascript:void(0)" class="p1">更多</a></li>
    </ul>
    <div class="bg2">
       <table  class="tab1">
        <tr class="th1">
            <td class="td4"><a href="javascript:void(0)"><img src="../img/21.png" class="img4"></a><a href="javascript:void(0)" class="yl1">
                飙升榜</a></td>
            <td  class="td4"><a href="javascript:void(0)"><img src="../img/22.png" class="img4"></a><a href="javascript:void(0)" class="yl1">
                新歌榜</a></td>
            <td  class="td4"><a href="javascript:void(0)"><img src="../img/23.png" class="img4"></a><a href="javascript:void(0)" class="yl1">
                原创榜</a></td>
        </tr><tr >
            <td class="td4">1&emsp;<a href="javascript:void(0)" class="yl">荔枝</a></td>
            <td  class="td4">1&emsp;<a href="javascript:void(0)" class="yl">我在等 · 2022</a></td>
            <td  class="td4">1&emsp;<a href="javascript:void(0)" class="yl">我爱上遗憾的原因</a></td>
        </tr><tr class="th1">
            <td class="td4">2&emsp;<a href="javascript:void(0)" class="yl">暧昧三十三天</a></td>
            <td  class="td4">2&emsp;<a href="javascript:void(0)" class="yl">暧昧三十三天</a></td>
            <td  class="td4">2&emsp;<a href="javascript:void(0)" class="yl">老银</a></td>
        </tr>
           <tr >
               <td class="td4">3&emsp;<a href="javascript:void(0)" class="yl">谁会被吻</a></td>
               <td  class="td4">3&emsp;<a href="javascript:void(0)" class="yl">100</a></td>
               <td  class="td4">3&emsp;<a href="javascript:void(0)" class="yl">暗里着迷</a></td>
           </tr>  <tr class="th1" >
               <td class="td4">4&emsp;<a href="javascript:void(0)" class="yl">深海回响</a></td>
               <td  class="td4">4&emsp;<a href="javascript:void(0)" class="yl">美丽心灵</a></td>
               <td  class="td4">4&emsp;<a href="javascript:void(0)" class="yl">海阔天空</a></td>
           </tr>  <tr >
               <td class="td4">5&emsp;<a href="javascript:void(0)" class="yl">夏夜最后的烟火</a></td>
               <td  class="td4">5&emsp;<a href="javascript:void(0)" class="yl">雁书</a></td>
               <td  class="td4">5&emsp;<a href="javascript:void(0)" class="yl">World</a></td>
           </tr>  <tr class="th1" >
               <td class="td4">6&emsp;<a href="javascript:void(0)" class="yl">夜车</a></td>
               <td  class="td4">6&emsp;<a href="javascript:void(0)" class="yl">荔枝</a></td>
               <td  class="td4">6&emsp;<a href="javascript:void(0)" class="yl">回到</a></td>
           </tr>  <tr >
               <td class="td4">7&emsp;<a href="javascript:void(0)" class="yl">度过此刻</a></td>
               <td  class="td4">7&emsp;<a href="javascript:void(0)" class="yl">无数</a></td>
               <td  class="td4">7&emsp;<a href="javascript:void(0)" class="yl">饕</a></td>
           </tr>  <tr class="th1">
               <td class="td4">8&emsp;<a href="javascript:void(0)" class="yl">我在等</a></td>
               <td  class="td4">8&emsp;<a href="javascript:void(0)" class="yl">如果突然想起我</a></td>
               <td  class="td4">8&emsp;<a href="javascript:void(0)" class="yl">面纱</a></td>
           </tr>  <tr >
               <td class="td4">9&emsp;<a href="javascript:void(0)" class="yl">Hold My Hand </a></td>
               <td  class="td4">9&emsp;<a href="javascript:void(0)" class="yl">度过此刻</a></td>
               <td  class="td4">9&emsp;<a href="javascript:void(0)" class="yl">一百万首情歌</a></td>
           </tr><tr class="th1" >
               <td class="td4"><a href="javascript:void(0)" class="yl">查看全部>> </a></td>
               <td  class="td4"><a href="javascript:void(0)" class="yl">查看全部>></a></td>
               <td  class="td4"><a href="javascript:void(0)" class="yl">查看全部>></a></td>
           </tr>

        </table>

    </div>

</div>
<div id="four">
<div class="bg3">
<p style=" margin:20px 20px;
float: left;
font-weight: lighter;">
   登录钢蛋音乐，可享受无限收藏的<br>&emsp;乐趣，并无限同步到手机
    <button  class="bun3" >用户登录</button>
</p>
</div>
    <div class="bg4">
        <div class="bg5">
    <ul class="dh">
        <li style="font-style:italic;
margin-top: 20px">入驻歌手</li>
        <li style="color: #111111;
        margin-top: 20px;
        margin-left: 90px;
         font-weight: lighter;">
            <a href="javascript:void(0)" class="yl">查看全部>></a></li>
    </ul>
            <a href="javascript:void (0)" class="yl"><div class="bg6">
                <img src="../img/24.jpg" style=" float: left ; width: 70px;height: 70px;object-fit: cover;">
                <h5 style="float:left;margin-left:30px ;">吴莫愁</h5>
            </div></a>
            <a href="javascript:void (0)" class="yl">
            <div class="bg6">
                <img src="../img/25.jpg" style=" float: left ;width: 70px;height: 70px;object-fit: cover;">
                <h5 style="float:left;margin-left:30px ;">张惠妹</h5>
            </div></a>
            <a href="javascript:void (0)" class="yl">
            <div class="bg6">
                <img src="../img/26.jpg" style="float: left ;  width: 70px;height: 70px;object-fit: cover;">
            <h5 style="float: left;margin-left:30px ;">孙楠</h5>
            </div></a>
            <a href="javascript:void (0)" class="yl">
            <div class="bg6">
                <img src="../img/27.jpg" style="float: left ;  width: 70px;height: 70px;object-fit: cover;">
            <h5 style="float: left;margin-left:30px ;">麦田老狼</h5>
            </div></a>
            <a href="javascript:void (0)" class="yl">
            <div class="bg6">
                <img src="../img/28.jpg" style="float: left ;  width: 70px;height: 70px;object-fit: cover;">
            <h5 style="float: left;margin-left:30px ;">舒志伟</h5>
            </div></a>
            <button  class="bun4" ><font color="black">申请成为钢蛋音乐人</font></button>
            <ul class="dh">
                <li style="font-style:italic;margin-top: 20px">热门主播</li>
            </ul>
            <a href="javascript:void (0)" class="yl"><div class="bg7">
                <img src="../img/29.jpg" style=" float: left ; width: 50px;height: 50px;object-fit: cover;">
                <h5 style="float:left;margin-left:30px ; margin-top: 0">疯狂小扬哥</h5>
                <br>
                <font size="3px" style="float: right;margin-top:-15px;margin-right: 60px">搞笑专家 抖音大V</font>
            </div></a>   <a href="javascript:void (0)" class="yl"><div class="bg7">
                <img src="../img/30.jpg" style=" float: left ; width: 50px;height: 50px;object-fit: cover;">
                <h5 style="float:left;margin-left:30px ; margin-top: 0">薛之谦</h5>
            <font size="3px" style="float: right;margin-top:-15px;margin-right: 60px">音乐鬼才 搞怪歌手</font>
            </div></a>   <a href="javascript:void (0)" class="yl"><div class="bg7">
                <img src="../img/31.jpg" style=" float: left ; width: 50px;height: 50px;object-fit: cover;">
                <h5 style="float:left;margin-left:30px ;margin-top: 0">郭聪明</h5>
            <font size="3px" style="float: right;margin-top:-15px;margin-right: 60px">搞怪歌手 抖音大V</font>
            </div></a>   <a href="javascript:void (0)" class="yl"><div class="bg7">
                <img src="../img/32.jpg" style=" float: left ; width: 50px;height: 50px;object-fit: cover;">
                <h5 style="float:left;margin-left:30px ;margin-top: 0">吴磊</h5>
            <font size="3px" style="float: right;margin-top:-15px;margin-right: 100px">超新星 硬汉</font>
            </div></a>   <a href="javascript:void (0)" class="yl"><div class="bg7">
                <img src="../img/33.jpg" style=" float: left ; width: 50px;height: 50px;object-fit: cover;">
                <h5 style="float:left;margin-left:30px ;margin-top: 0">赵露思</h5>
            <font size="3px" style="float: right;margin-top:-15px;margin-right: 80px">超新星 搞怪女</font>
            </div></a>
        </div>
    </div>
</div>
<div id="six">
    <div class="bg8">
        <ul class="six">
            <li ><a href="javascript:void(0)" class="p2">服务条款</a></li>
            <li ><a href="javascript:void(0)" class="p2">隐私政策</a></li>
            <li ><a href="javascript:void(0)" class="p2">版权投诉</a></li>
            <li ><a href="javascript:void(0)" class="p2">投资者关系</a></li>
            <li ><a href="javascript:void(0)" class="p2">广告合作</a></li>
            <li ><a href="javascript:void(0)" class="p2">廉政举报</a></li>
            <li ><a href="javascript:void(0)" class="p2">联系我们</a></li>
        </ul>
        <p style="font-size: 13px;
                font-weight: 100;margin-left:10px ">
            钢蛋公司版权所有©1997-2022九江佳鸡有限公司运营：<a href="javascript:void(0)" class="j">赣网文[2021] 1186-054号 赣<br><br>B2-20090191-18  工业和信息化部备案管理系统网站 </a>
            <img src="../img/34.png" style="width: 18px;height: 18px;object-fit: cover;">
            <a href="javascript:void(0)" class="j">赣公网安备 33010902002564号</a><br><br>
            互联网宗教信息服务许可证：赣（2022）0000120 监督举报邮箱：1583523027@qq.com

        </p>
    </div>
    <div class="bg9">
           <a href="javascript:void(0)" > <img src="../img/35.png" style="width: 70px;height: 70px;object-fit: cover;margin-top: 45px;margin-left:10px"></a>
        <p style="margin-top: 0px;position: absolute;font-size: 13px; font-weight: 100;">Amped studio</p>
           <a  href="javascript:void(0)"> <img src="../img/36.png" style="width: 70px;height: 70px;object-fit: cover;margin-top: 45px ;margin-left:40px"></a>
        <p style="margin-top: 0px;position: absolute;font-size: 13px; font-weight: 100; margin-left: 135px">用户认证</p>
            <a  href="javascript:void(0)"><img src="../img/37.png" style="width: 70px;height: 70px;object-fit: cover;margin-top: 45px;margin-left:40px"></a>
        <p style="margin-top: 0px;position: absolute;font-size: 13px; font-weight: 100;margin-left: 240px">独立音乐人</p>
            <a  href="javascript:void(0)"><img src="../img/38.png" style="width: 70px;height: 70px;object-fit: cover;margin-top: 45px;margin-left:40px"></a>
        <p style="margin-top: 0px;position: absolute;font-size: 13px; font-weight: 100;margin-left: 375px">赞 赏</p>
            <a  href="javascript:void(0)"><img src="../img/39.png" style="width: 70px;height: 70px;object-fit: cover;margin-top: 45px;margin-left:40px"></a>
        <p style="margin-top: 0px;position: absolute;font-size: 13px; font-weight: 100;margin-left: 480px">视频奖励</p>
    </div>

</div>


<script>
    var index=2;
    var a= document.getElementById("img");
    function fun(){
        if(index>=5){
            index=2;
        }
    a.src="../img/"+index+".jpg";
    index++;

    }
    setInterval(fun,3000);
    function fun1(){
      index++;
      if (index>=5){
          index=2;
      }
    a.src="../img/"+index+".jpg";
    } function fun2(){
      index--;
      if (index<=1){
          index=4;
      }
        a.src="../img/"+index+".jpg";

    }


</script>
</body>
</html>
